const app = getApp()
import { list } from '../../api/category'

Page({
  data: {
    header: app.global.headerHeight,
    back: true,
    title: '商品分类',
    loading: true,
    category: [],
    category_id: 0,
    template: 0,
    active: 0,
    menuTop: 0,
    menuHeight: '', // 菜单高度
    scrollTop: 0 // tab标题的滚动条位置
  },
  onLoad (options) {
    wx.getSystemInfo({
      success: (res) => {
        this.setData({
          menuTop: this.data.header + 50,
          // 窗口高度 - (微信固定高度) - 自定义header高度
          menuHeight: res.windowHeight - (res.windowWidth * 90 / 750) - this.data.header - 5
        })
      }
    })
    this.getList()
  },
  onPullDownRefresh () { /* 监听用户下拉动作*/ },
  onReachBottom () {
    this.selectComponent('#goods_list').onReachBottom()
  },

  // ===================methon================

  getList () {
    this.setData({ loading: true })
    list().then(res => {
      const { data } = res
      this.setData({
        category: data.category,
        category_id: data.category.length > 0 ? data.category[0].id : 0,
        template: data.template
      })
    })
      .finally(() => {
        this.setData({ loading: false })
      })
  },

  // 点击标题切换当前页时改变样式index
  changeTab (event) {
    const index = event.currentTarget.dataset.index
    const category_id = event.currentTarget.dataset.id

    if (this.data.active == index) {
      return false
    }
    wx.pageScrollTo({ scrollTop: 0 })
    this.setData({
      active: index,
      category_id: category_id
    })
    this.checkCor()
    if (this.data.template == 30) {
      this.selectComponent('#goods_list').onChange(category_id)
    }
  },

  // 判断当前滚动超过一屏时，设置tab标题滚动条。
  checkCor () {
    // 这里计算按照实际情况进行修改，动态数据要进行动态分析
    // 思路：窗体高度/单个分类高度 200rpx 转px计算 =>得到一屏幕所显示的个数，结合后台传回分类总数进行计算
    // 数据很多可以多次if判断然后进行滚动距离计算即可
    if (this.data.active > 7) {
      this.setData({ scrollTop: 500 })
    } else {
      this.setData({ scrollTop: 0 })
    }
  },

  redirect (event) {
    app.redirect(event.currentTarget.dataset.url)
  }
})